import { Typography, Timeline } from 'antd';
import '../../assets/css/portfolio.css';
import WorksList from './WorksList';

const { Title, Text } = Typography;

const Education = () => {
  const timelineItems = [
    {
      title: '南京师范大学 211硕士研究生',
      subtitle: '2023-2026 地图学与地理信息系统（双一流学科）',
      award: '国家重点研发项目系统开发负责人 、优秀研究生',
    },
    {
      title: '个人网站开发',
      subtitle: '2025.04-2025.05',
      description: '作为AI时代的前端开发人员，以Trae AIIDE工具为辅助进行个人网站的开发，网站采用Vite和React框架构建，通过图表、地图和动画等多种形式呈现内容。',
      award: '项目开发、测试与项目上线全流程，相关成果博客总访问量5w+',
    },
    {
      title: 'LLM对话框项目开发|字节青训项目',
      subtitle: '2025.02-2025.05',
      description: '在AIGC时代,与大模型交互常见的是对话框模式,需设计实现支持多种输入输出形式的对话框组件,为用户提供便捷交互体验。',
      award: '相关成果博客总访问量10w+',
    },
    {
      title: '城市灾害应急管理集成系统| 国家重点研发政府间合作项目',
      subtitle: '2023.10-2024.05',
      description: '在智慧城市战略背景下，项目面向内涝、团雾和火灾等灾害，开发了集灾害模型模拟、场景可视化与应急预案管理于一体的系统，系统各子模块进行软件功能测试，测试结果稳定可靠。',
      award: 'ICA 最佳学生论文报告奖（国际级）、超图系统开发大赛全国三等奖和软件著作3项',
    },
    {
      title: '衡阳师范学院 统招一本',
      subtitle: '2019-2023 地理信息科学（省级重点）',
      award: [
        '湖南省创新创业优秀毕业生、主导校发展规划中心网站开发',
        '国家励志奖学金、三好学生、优秀共青团员、优秀学生奖学金',
      ].join('\n'),
    },
    {
      title: '古建筑在线建模与可视化平台建设',
      subtitle: '2021.03-2021.09',
      description: '开发了支持古建筑三维建模和在线展示的平台，提供沉浸式的文化遗产数字化体验。',
      award: '全国青少年科普暨实验大赛全国总决赛三等奖 湖南省互联网+创新创业大赛二等奖',
    },
    {
      title: '校发展规划中心网站开发',
      subtitle: '2022.01-2022.05',
      description: '负责学校发展规划中心网站的全栈开发工作，实现了信息展示、数据管理等功能。',
      award: '相关成果博客位列CSDN同主题文章Top5,取得个人第一笔项目开发经费',
    },
   
  ];

  return (
    <section id="portfolio" className="bg-white mt-20 relative z-10">
      <div className="portfolio-container">
        <Title level={1} className="section-title">作品集</Title>
        
        <Timeline
          mode="alternate"
          items={timelineItems.map((item) => ({
            children: (
              <div className="timeline-item">
                <Title level={4} className="timeline-title">{item.title}</Title>
                <Text type="secondary" className="timeline-subtitle">{item.subtitle}</Text>
                <Text className="timeline-description">{item.description}</Text>
                {item.award&&<Text className="timeline-description"><b>{item.award}</b></Text>}
              </div>
            ),
            color: '#48dbfb',
          }))}
        />
      </div>
      <WorksList/>
    </section>
  );
};

export default Education;